<template>
  <div class="list-main">
    <van-nav-bar
      left-text="返回"
      class="list-title"
      left-arrow
      @click-left="backToStatisticsList"
    >
      <template #title>
        <span class="list-title"></span>
      </template>
    </van-nav-bar>
    <div class="select_wrp">
      <div class="select_title">{{ title }}</div>

      <div class="select_option" @click="select" data-id="s1">
        <div class="option_img">
          <img src="/images/select1.jpg" alt="" srcset="" />
        </div>
        <div class="option_title">全校排名</div>
      </div>
      <div class="select_option" @click="select" data-id="s2">
        <div class="option_img">
          <img src="/images/select2.jpg" alt="" srcset="" />
        </div>
        <div class="option_title">内部排名</div>
      </div>
      <div class="select_option" @click="select" data-id="s3">
        <div class="option_img">
          <img src="/images/select3.jpg" alt="" srcset="" />
        </div>
        <div class="option_title">单位排名</div>
      </div>
    </div>
    <van-action-sheet v-model="show" :actions="actions" @select="onSelect" />
  </div>
</template>

<script>
import { listTeacherStatistics } from "@/api/pingjiao/statistics";
import { Toast } from "vant";
export default {
  name: "StatisticsListInAll",
  data() {
    return {
      show: false,
      title: "",
      evalutionActivityId: 0,
      actions: [
        {
          id: 405,
          name: "信息工程学院",
        },
        {
          id: 306,
          name: "就业指导中心（创新创业研究培训中心）",
        },
        {
          id: 307,
          name: "发展规划研究室（职业教育研究所）",
        },
        {
          id: 308,
          name: "科研外事处",
        },
        {
          id: 309,
          name: "心理健康教育中心",
        },
        {
          id: 310,
          name: "中职管理部",
        },
        {
          id: 311,
          name: "职教后勤管理服务公司",
        },
        {
          id: 312,
          name: "职教建设开发有限公司",
        },
        {
          id: 313,
          name: "继续教育与培训学院",
        },
        {
          id: 314,
          name: "二期工程建设领导小组办公室",
        },
        {
          id: 315,
          name: "后勤服务中心",
        },
        {
          id: 401,
          name: "师范学院",
        },
        {
          id: 402,
          name: "智能制造学院",
        },
        {
          id: 403,
          name: "财经学院",
        },
        {
          id: 404,
          name: "体育与健康学院（公共体育课教学部）",
        },
        {
          id: 305,
          name: "图书馆",
        },
        {
          id: 406,
          name: "交通学院",
        },
        {
          id: 407,
          name: "数控技术学院",
        },
        {
          id: 408,
          name: "机械制造系",
        },
        {
          id: 409,
          name: "旅游学院",
        },
        {
          id: 410,
          name: "建筑学院",
        },
        {
          id: 411,
          name: "艺术学院（公共艺术课教学部）",
        },
        {
          id: 412,
          name: "航海学院",
        },
        {
          id: 413,
          name: "现代设计与工程学院",
        },
        {
          id: 414,
          name: "计算机学院",
        },
        {
          id: 501,
          name: "基础课教学部",
        },
        {
          id: 502,
          name: "公共体育课教学部",
        },
        {
          id: 503,
          name: "马克思主义学院（公共劳动课教学部）",
        },
        {
          id: 504,
          name: "工业基础训练中心",
        },
        {
          id: 601,
          name: "技术研发应用中心",
        },
        {
          id: 901,
          name: "长病假",
        },
        {
          id: 214,
          name: "基建处",
        },
        {
          id: 101,
          name: "校领导",
        },
        {
          id: 201,
          name: "党委办公室（统战部）",
        },
        {
          id: 202,
          name: "党政工作督查评议委员会",
        },
        {
          id: 203,
          name: "院长办公室",
        },
        {
          id: 204,
          name: "组织部",
        },
        {
          id: 205,
          name: "宣传部",
        },
        {
          id: 206,
          name: "教务处",
        },
        {
          id: 207,
          name: "教学督导评议委员会",
        },
        {
          id: 208,
          name: "学生处（党委学生工作部）",
        },
        {
          id: 209,
          name: "人事处（党委教师工作部）",
        },
        {
          id: 210,
          name: "财务处",
        },
        {
          id: 211,
          name: "国有资产管理处（设备与实训管理处）",
        },
        {
          id: 212,
          name: "招生就业处",
        },
        {
          id: 213,
          name: "后勤处",
        },
        {
          id: 304,
          name: "合作办学办公室",
        },
        {
          id: 215,
          name: "安全保卫处（武装部）",
        },
        {
          id: 216,
          name: "信息中心（信息化管理办公室）",
        },
        {
          id: 217,
          name: "审计处",
        },
        {
          id: 218,
          name: "纪律检查委员会（监察处）",
        },
        {
          id: 219,
          name: "工会",
        },
        {
          id: 220,
          name: "离退休人员服务中心",
        },
        {
          id: 221,
          name: "团委",
        },
        {
          id: 222,
          name: "机关党委",
        },
        {
          id: 223,
          name: "党委巡察工作委员会",
        },
        {
          id: 224,
          name: "质量考核工作委员会",
        },
        {
          id: 225,
          name: "党建工作指导委员会（思政工作创新发展中心）",
        },
        {
          id: 301,
          name: "北校区教育教学保障中心",
        },
        {
          id: 302,
          name: "西校区教育教学保障中心",
        },
        {
          id: 303,
          name: "质量办公室",
        },
      ],
    };
  },
  created() {
    this.$emit("show", -1); //传递给父组件改变tab的激活active样式
    this.evalutionActivityId = this.$route.query.evalutionActivityId;
    this.title = this.$route.query.title;
  },
  watch: {},
  methods: {
    select(e) {
      let selcetId = e.currentTarget.dataset.id;
      switch (selcetId) {
        case "s1":
          this.$router.push({
            path: "/dingding/statisticsListInAll",
            query: {
              evalutionActivityId: this.evalutionActivityId,
            },
          });
          break;
        case "s2":
          this.show = !this.show;
          break;
        case "s3":
          this.$router.push({
            path: "/dingding/statisticsListByDept",
            query: {
              evalutionActivityId: this.evalutionActivityId,
            },
          });
          break;
        default:
          break;
      }
    },
    onSelect(item) {
      // 默认情况下点击选项时不会自动收起
      // 可以通过 close-on-click-action 属性开启自动收起
      this.show = false;
      this.$router.push({
        path: "/dingding/statisticsListInDept",
        query: {
          evalutionActivityId: this.evalutionActivityId,
          deptName: item.name,
          deptId: item.id,
        },
      });
    },
    backToStatisticsList() {
      this.$router.push({ path: "/dingding/statisticsList" });
    },
  },
};
</script>

<style  rel="stylesheet/scss" lang="scss">
.select_wrp {
  display: flex;
  flex-direction: column;
}
.select_title {
  margin: 15px 10px;
  line-height: 20px;
  font-size: 18px;
  font-weight: bolder;
  text-align: center;
}
.select_option {
  background: #c5dff8;
  cursor: pointer;
  border: 2px solid #ccc;
  padding: 5px;
  width: 70%;
  margin: 5px auto;
  display: flex;
  flex-direction: row;
}
.select_option .option_img{
  width: 30%;
}
.select_option .option_img img {
  width: 100%;
  height: 50px;
  border: 1px solid #ccc;
}
.select_option .option_title {
  font-size: 30px;
  font-weight: bold;
  line-height: 50px;
  text-align: center;
  width: 70%;
  color: #566f89;
  text-shadow: 1px 1px 0 #e4f1ff;
}
</style>
